<!-- eslint-disable vue/multi-word-component-names -->
<script setup lang="ts"></script>

<template>
  <div class="error">
    <div class="error-svg">
      <slot></slot>
    </div>
    <!-- 使用 routerlink 页面会无刷新跳转,适合用在错误页（如 404）、登录页或其他需要快速返回首页的场景 -->
    <router-link to="/">
      <el-button type="primary"> 回到首页 </el-button>
    </router-link>
  </div>
</template>

<style lang="scss" scoped>
.error {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  &-svg {
    width: 500px;
    margin-bottom: 50px;
  }
}
</style>
